<template>
	<view class="main">
		<!--公共头部-->
		<my-header :background="background" :is-back="false" title="我的"></my-header>
		
		<view>
			
			<view class="main-zhong4 dis_flex ali-ite">
				<view>
					<u-image width="80px" height="80px" border-radius="120" :src="imgurl+'morentouxiang.jpg'">
						<u-loading slot="loading"></u-loading>
					</u-image>
				</view>
				<view class="mar-lef-20">
					<view :hover-class="hoverClass" class="dis_flex mar-bot-5">
						<view>姓名：周扬</view>
						<view class="mar-lef-10">地区：海口</view>
					</view>
					<view class="mar-bot-5">
						<view>职务：PHP</view>
					</view>
					<view>
						<view>职级：H7</view>
					</view>
				</view>
			</view>
			
			<view class="main-zhong4 mar-top-15">
				<u-cell-group>
					<u-cell-item :icon="imgurl+'oa-my-wodexinxi.png'" icon-size="24" title="我的信息"></u-cell-item>
					<!-- <u-line color="#8a8a8a" height="10"></u-line> -->
					<!-- <u-gap height="1" bg-color="#8a8a8a"></u-gap> -->
					<u-cell-item :icon="imgurl+'oa-my-wodeshenqing.png'" icon-size="24" title="我的申请"></u-cell-item>
					<u-cell-item :icon="imgurl+'oa-my-xinzijiesuan.png'" icon-size="24" title="薪酬/结算"></u-cell-item>
					<u-cell-item @click="navigateTo('/my/market/addMarket')" :icon="imgurl+'oa-my-xianyoushichang.png'" icon-size="24" title="现有市场/项目"></u-cell-item>
					<u-cell-item @click="navigateTo('/my/companyPost/companyPost-index')" :icon="imgurl+'oa-my-gongsigangwei.png'" icon-size="24" title="公司岗位"></u-cell-item>
					<u-cell-item @click="navigateTo('/my/staffing/addPersonnel')" :icon="imgurl+'oa-my-renyuanpeizhi.png'" icon-size="24" title="人员角色配置"></u-cell-item>
					<u-cell-item :icon="imgurl+'oa-my-gongsizuzhijiagou.png'" icon-size="24" title="公司组织架构"></u-cell-item>
				</u-cell-group>
			</view>
			
			<view class="main-zhong4 mar-top-15">
				<u-cell-item @click="confirm(1)" :icon="imgurl+'oa-my-tuichudengl.png'" icon-size="24" title="退出登录"></u-cell-item>
			</view>
			
		</view>
		
		<!--退出登录-->
		<u-modal @confirm="logout()" v-model="logoutShow" :mask-close-able="true" show-title="true" show-cancel-button="true">
			<view class="slot-content">
				<rich-text>是否退出当前账号</rich-text>
			</view>
		</u-modal>
		
		<!--公共底部-->
		<my-footer :config="config"></my-footer> 
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import myHeader from '@/components/workbench/header.vue';
	import myFooter from '@/components/workbench/footer.vue';
	export default {
		data() {
			return {
				logoutShow : false,
				hoverClass : 'cell_hover'
			}
		},
		methods:{
			//退出登录开始
			confirm(e){
				// 弹窗退出登录
				if(e==1)
				{
					this.logoutShow = true;
				}
			},
			// 退出登录
			logout(){
				this.load();
				uni.removeStorageSync('userInfo');
				uni.navigateTo({ 
					url:"/pages/index/index"
				})
			},
		},
		components:{
			myHeader,
			myFooter   
		}
	}
</script>

<style>
	.slot-content{
		padding:20px;
		font-size:18px;
		color:red;
		text-align: center;
	}
	.u-cell__right-icon-wrap{
		color:#0051BA !important;
	}
	.u-cell_title{
		font-size: 12px !important;
	}
	.u-cell{
		padding: 10rpx 19rpx !important;
		padding-bottom:10px !important;
	}
	.cell_hover{
		background:#ccc;
	}
	.main-zhong4 {
		width: 100%;
		border-radius: 8px;
		background: #fff;
		padding:10px 20px 10px 20px;
	}
	.main {
		padding:10px;
		position: relative;
		min-height:100vh;
		background-image: linear-gradient( #005687, #E4E4E5 );
	}
	page{
		height:100%;
	}
</style>
